<template>
  <el-form-item :label="lable" prop="fileList">
    <el-upload
      class="upload-demo"
      :action="this._uploadurl_"
      :file-list="filelist"
      :headers="this.headers"
      :on-success="handleAvatarSuccess"
      :before-remove="beforeRemove"
      :on-remove="handleRemove"
    >
      <el-button size="small" type="primary">点击上传</el-button>
    </el-upload>
  </el-form-item>

</template>

<script>
  import common from "../utils/common"

  export default {
    components: {

    },
    name: 'FileUpload',
    props: ['lable','filelist'],
    data () {
      return {
        fileList:[],
        rules: {
          fileList: [
            { required: true, message: '请上传文件', trigger: 'blur' },
          ],
        },

        _uploadurl_,
        headers:{
          token: window.vm.$cookies.get('token')
        },
      }
    },
    methods: {

      beforeRemove(file, fileList) {
        return this.$confirm(`确定移除 ${ file.name }？`);
      },
      handleAvatarSuccess(res, file,fileList) {
//        this.fileList = common.parseFilePath(fileList)
        this.$emit("changeFiles",common.parseFilePath(fileList))
      },
      handleRemove(file, fileList) {
//        this.fileList = common.parseFilePath(fileList)
        this.$emit("changeFiles",common.parseFilePath(fileList))
      },


      init () {
        this._uploadurl_ = _uploadurl_
      }
    },
    mounted: function () {
    },
    created: function () {
      this.init()
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  h1, h2 {
    font-weight: normal;
  }
</style>
